import React, { Component } from "react";
import PropTypes from "prop-types";
import { connect } from "react-redux";
import { getAwardDetail } from "../../actions";
import { Award } from "../../components/AwardList";

class AwardDetail extends Component {
  static propTypes = {
    dispatch: PropTypes.func.isRequired,
    awardDetail: PropTypes.object.isRequired,
    awardClicked: PropTypes.func.isRequired
  };
  componentWillMount() {
    let id = this.props.match.params.id;
    if (id) {
      this.updateAward(id);
    } else {
      console.error("参数错误");
    }
  }

  updateAward(id) {
    let { dispatch } = this.props;
    dispatch(getAwardDetail(dispatch, id));
  }

  render() {
    const { awardDetail, awardClicked } = this.props;
    return (
      <div>
        <Award
          award={awardDetail}
          key={awardDetail.id}
          awardClicked={awardClicked}
        />
      </div>
    );
  }
}

const mapStateToProps = state => {
  let awardClicked = () => null;
  const { awardListReducer } = state;
  let { awardDetail } = awardListReducer;
  return { awardDetail, awardClicked };
};

export default connect(mapStateToProps)(AwardDetail);
